<!--
 * @Description: 
 * @Version: 2.0
 * @Autor: wiz
 * @Date: 2024-05-04 08:47:37
 * @LastEditors: swc
 * @LastEditTime: 2024-05-09 17:05:59
-->

<template>
  <span class="button-container">
    <Button
      :disabled="componentProps.config.disabled"
      :type="componentProps.config.style.color || 'default'"
      :size="componentProps.config.style.size || 'small'"
      :shape="componentProps.config.style.shape || null"
      @click="onClick"
      @dblclick="onDblclick"
      ><span v-show="getIcon" :class="getIcon"></span
      ><span>{{ $srv.getI18nBySrv(componentProps.config.title) }}</span></Button
    >
  </span>
</template>

<script lang="ts">
import { T_srv, Tsrv, vue } from '@/services';
import { N_input } from '@/types';

@T_srv.comp
export default class cButton extends vue {
  // @T_srv.prop() renderOpts: N_input.I_renderOpts;

  // @T_srv.prop() params: any;
  @T_srv.prop({ required: true }) componentProps: N_input.I_componentProps;

  /* 组件名 */
  private name: string = 'cButton';

  private G_paramsFromComp: 'oBaseGrid' | 'oBaseForm' = null;

  get getIcon() {
    if (Tsrv.getx(this.componentProps.config, 'style.icon', false)) {
      return `wy-icon ${this.componentProps.config.style.icon}`;
    }
    return '';
  }

  created() {
    if (
      !Tsrv.utils.noValue(this.componentProps?.oControl?.params) &&
      Object.prototype.hasOwnProperty.call(
        this.componentProps.oControl.params,
        'property'
      )
    ) {
      this.G_paramsFromComp = 'oBaseForm';
    } else {
      this.G_paramsFromComp = 'oBaseGrid';
    }
  }

  mounted() {}

  destroyed() {}

  private init() {}

  onClick(e) {
    let clickPubApiName = '';
    if (Tsrv.getx(this.componentProps.config, 'event.click', false)) {
      clickPubApiName = this.componentProps.config.event['click'];
    }
    if (!Tsrv.utils.noValue(clickPubApiName)) {
      this.execProcedure(clickPubApiName);
    }
  }

  onDblclick(e) {
    const clickPubApiName = this.componentProps.config.event['dblclick'];
    if (!Tsrv.utils.noValue(clickPubApiName)) {
      this.execProcedure(clickPubApiName);
    }
  }

  // 执行存储过程
  private execProcedure(spName: string) {
    const params = this.componentProps.oControl.params;
    const renderOpts = this.componentProps.oControl.renderOpts;
    if (Tsrv.noValue(renderOpts) || Tsrv.noValue(params)) {
      return;
    }
    if (typeof renderOpts.props.getTcommand === 'function') {
      const example = renderOpts.props.getTcommand();
      if (typeof example.doOControlAction === 'function') {
        let row = {};
        let field = '';
        if (this.G_paramsFromComp === 'oBaseForm') {
          row = params.row;
          field = params.property;
        } else if (this.G_paramsFromComp === 'oBaseGrid') {
          row = params.row;
          field = params.column.property;
        }
        const p = {
          row,
          field
        };
        example.doOControlAction(spName, p);
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.button-container {
  padding: 6px;
}

::v-deep .ivu-btn {
  > span {
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 100%;
    width: 100%;
    flex-wrap: nowrap;
    overflow: hidden;
  }
}
</style>
